<template>
  <div class="container-fluid">
    <div class="row center-block">
      <div class="col-md-12">
        <div class="row">
          <div class="col-md-12">
            <div class="box-body">
              <div class="box box-primary">
                <div class="box-body">
                  <div class="row">
                    <label class="col-sm-2 control-label">所属部门</label>
                    <div class="col-sm-3 control-label">
                      <p>{{ this.$store.state.userDepart.department }}</p>
                    </div>
                    <label class="col-sm-2 control-label">时间</label>
                    <div class="col-sm-3">
                      <MyDatePicker v-bind:date='belongTime' @timeChanged="(time)=>this.ontimechanged(time)" ref="belongTime"></MyDatePicker>
                    </div>
                    <div class="col-sm-2 control-label">
                      <button type="button" class="btn btn btn-success pull-right">
                        <i class="fa fa-save" @click="exportData">导出</i>
                      </button>
                     </div>
                  </div>
                  <div class="row">
                    <div class="col-sm-12 table-responsive">
                      <table aria-describedby="example1_info" role="grid" id="example1" class="table table-striped table-bordered">
                        <thead>
                          <tr role="row">
                            <th aria-label="指标名称" style="width: 167px;" colspan="1" rowspan="1" tabindex="0">指标名称</th>
                            <th aria-label="代码" style="width: 160px;" colspan="1" rowspan="1" tabindex="0">代码</th>
                            <th aria-label="本月实有" style="width: 160px;" colspan="1" rowspan="1" tabindex="0">本月实有</th>
                            <th aria-label="上月实有" style="width: 160px;" colspan="1" rowspan="1" tabindex="0">上月实有</th>
                            <th aria-label="指标名称" style="width: 167px;" colspan="1" rowspan="1" tabindex="0">指标名称</th>
                            <th aria-label="代码" style="width: 160px;" colspan="1" rowspan="1" tabindex="0">代码</th>
                            <th aria-label="本月实有" style="width: 160px;" colspan="1" rowspan="1" tabindex="0">本月实有</th>
                            <th aria-label="上月实有" style="width: 160px;" colspan="1" rowspan="1" tabindex="0">上月实有</th>
                            <th aria-label="指标名称" style="width: 167px;" colspan="1" rowspan="1" tabindex="0">指标名称</th>
                            <th aria-label="代码" style="width: 160px;" colspan="1" rowspan="1" tabindex="0">代码</th>
                            <th aria-label="本月实有" style="width: 160px;" colspan="1" rowspan="1" tabindex="0">本月实有</th>
                            <th aria-label="上月实有" style="width: 160px;" colspan="1" rowspan="1" tabindex="0">上月实有</th>
                          </tr>
                        </thead>
                        <tbody>
                          <tr class="even" role="row">
                            <td class="">一、从业人员月末人数</td>
                            <td>01</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.people" ref="people" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.people" placeholder=""></el-input>
                            </td>
                            <td class="">工程技术</td>
                            <td>17</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.engineering" ref="engineering" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.engineering" placeholder=""></el-input>
                            </td>
                            <td class="">三、从业人员变动情况</td>
                            <td>32</td>
                            <td>{{ thismonthtotalChanges}}</td>
                            <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;--&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class=""> 其中：女性</td>
                            <td>02</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.females" ref="females" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.females" placeholder=""></el-input>
                            </td>
                            <td class="">广告营销</td>
                            <td>18</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.adMarketing" ref="adMarketing" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.adMarketing" placeholder=""></el-input>
                            </td>
                            <td class="">（一）增加人数</td>
                            <td>33</td>
                            <td> {{thismonthincreaseWorkers}}</td>
                            <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;--&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class=""> （一）职工人数</td>
                            <td>03</td>
                            <td>{{thismonthtotalEmployees}}</td>
                            <td>{{lastmonthtotalEmployees}}</td>
                            <td class="">工勤</td>
                            <td>19</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.worker" ref="worker" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.worker" placeholder=""></el-input>
                            </td>
                            <td class="">从社会招聘录用</td>
                            <td>34</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.fromSocial" ref="fromSocial" placeholder=""></el-input>
                            </td>
                            <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;--&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">事业编制固定制职工</td>
                            <td>04</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.fixedEmployee" ref="fixedEmployee" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.fixedEmployee" placeholder=""></el-input>
                            </td>
                            <td class="">（二）其他从业人员</td>
                            <td>20</td>
                            <td>{{thismonthotherWorkers}}</td>
                            <td>{{lastmonthotherWorkers}}</td>
                            <td class="">转业、退伍军人</td>
                            <td>35</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.fromTransfer" ref="fromTransfer" placeholder=""></el-input>
                            </td>
                            <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;--&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">事业编制聘用制职工</td>
                            <td>05</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.inviteEmployee" ref="inviteEmployee" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.inviteEmployee" placeholder=""></el-input>
                            </td>
                            <td class="">聘用的离退休人员</td>
                            <td>21</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.retiedWorker" ref="retiedWorker" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.retiedWorker" placeholder=""></el-input>
                            </td>
                            <td class="">录用的大中专应届生</td>
                            <td>36</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.student" placeholder=""></el-input>
                            </td>
                            <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;--&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">集团企聘职工</td>
                            <td>06</td>
                            <td>
                              <el-input size="medium"  v-model="thismonth.groupEmployee" ref="groupEmployee" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.groupEmployee" placeholder=""></el-input>
                            </td>
                            <td class="">三方协议借用人员</td>
                            <td>22</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.threePartWorker" ref="threePartWorker" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.threePartWorker" placeholder=""></el-input>
                            </td>
                            <td class="">从集团内部单位调入</td>
                            <td>37</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.fromInternalOfCompany" placeholder=""></el-input>
                            </td>
                            <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;--&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">直属单位聘用职工</td>
                            <td>07</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.directEmployee" ref="directEmployee" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.directEmployee" placeholder=""></el-input>
                            </td>
                            <td class="">非全日制用工人员</td>
                            <td>23</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.partTimeWorker" ref="partTimeWorker" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.partTimeWorker" placeholder=""></el-input>
                            </td>
                            <td class="">从集团外单位调入</td>
                            <td>38</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.fromOutOfCompany" placeholder=""></el-input>
                            </td>
                            <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;--&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">文化程度</td>
                            <td>08</td>
                            <td>{{thismonthtotaledus}}</td>
                            <td>{{lastmonthtotaledus}}</td>
                            <td class="">其他</td>
                            <td>24</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.otherWorker" ref="otherWorker" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.otherWorker" placeholder=""></el-input>
                            </td>
                            <td class="">其他</td>
                            <td>39</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.fromOther" placeholder=""></el-input>
                            </td>
                            <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;--&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">研究生</td>
                            <td>09</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.graduate" ref="graduate" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.graduate" placeholder=""></el-input>
                            </td>
                            <td class=""></td>
                            <td></td>
                            <td>
                              <!--<el-input size="medium"  v-model="thismonth.otherWorker" placeholder=""></el-input>-->
                            </td>
                            <td>
                              <!--<el-input size="medium"  v-model="lastmonth.otherWorker" placeholder=""></el-input>-->
                            </td>
                            <td class="">（二）减少人数</td>
                            <td>40</td>
                            <td>{{thismonthdecreaseWorkers}}</td>
                            <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;--&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">大学本科</td>
                            <td>10</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.undergraduate" ref="undergraduate" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.undergraduate" placeholder=""></el-input>
                            </td>
                            <td class="">二、保留劳动关系的职工</td>
                            <td>25</td>
                            <td>{{thismonthtotalkeeps}}</td>
                            <td>{{thismonthtotalkeeps}}</td>
                            <td class="">退休</td>
                            <td>41</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.retired" placeholder=""></el-input>
                            </td>
                            <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;--&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">大专</td>
                            <td>11</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.juniorCollege" ref="juniorCollege" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.juniorCollege" placeholder=""></el-input>
                            </td>
                            <td class="">离岗退养职工</td>
                            <td>26</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.keepRetired" ref="keepRetired" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.keepRetired" placeholder=""></el-input>
                            </td>
                            <td class=""> 解除、终止合同</td>
                            <td>42</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.interrupt" placeholder=""></el-input>
                            </td>
                            <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;--&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">中专及高中</td>
                            <td>12</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.highSchool" ref="highSchool" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.highSchool" placeholder=""></el-input>
                            </td>
                            <td class="">长期病假职工</td>
                            <td>27</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.keepIll" ref="keepIll" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.keepIll" placeholder=""></el-input>
                            </td>
                            <td class=""> 辞职、辞退</td>
                            <td>43</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.resignation" placeholder=""></el-input>
                            </td>
                            <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;--&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">初中及以下</td>
                            <td>13</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.juniorMiddleSchool" ref="juniorMiddleSchool" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.juniorMiddleSchool" placeholder=""></el-input>
                            </td>
                            <td class="">脱产学习职工</td>
                            <td>28</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.keepStudy" ref="keepStudy" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.keepStudy" placeholder=""></el-input>
                            </td>
                            <td class="">集团内部调动</td>
                            <td>44</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.changed" placeholder=""></el-input>
                            </td>
                            <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;--&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">工作岗位</td>
                            <td>14</td>
                            <td>{{thismonthpositions}}</td>
                            <td>{{lastmonthpositions}}</td>
                            <td class="">待岗职工</td>
                            <td>29</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.keepChange" ref="keepChange" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.keepChange" placeholder=""></el-input>
                            </td>
                            <td class="">调离集团</td>
                            <td>45</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.out" placeholder=""></el-input>
                            </td>
                            <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;--&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class="">采编</td>
                            <td>15</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.editing" ref="editing" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.editing" placeholder=""></el-input>
                            </td>
                            <td class="">借给集团外单位职工</td>
                            <td>30</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.keepBorrow" ref="keepBorrow" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.keepBorrow" placeholder=""></el-input>
                            </td>
                            <td class="">开除</td>
                            <td>46</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.fired" placeholder=""></el-input>
                            </td>
                            <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;--&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
                          </tr>
                          <tr class="even" role="row">
                            <td class=""> 行政管理</td>
                            <td>16</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.administrativeManagement" ref="administrativeManagement" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.administrativeManagement" placeholder=""></el-input>
                            </td>
                            <td class="">其他</td>
                            <td>31</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.keepOther" ref="keepOther" placeholder=""></el-input>
                            </td>
                            <td>
                              <el-input size="medium"  :disabled='true' v-model="lastmonth.keepOther" placeholder=""></el-input>
                            </td>
                            <td class="">其他</td>
                            <td>47</td>
                            <td>
                              <el-input size="medium"  :disabled='!editable' v-model="thismonth.toOther" placeholder=""></el-input>
                            </td>
                            <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;--&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
                          </tr>
                        </tbody>
                      </table>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import monthApi from "../../../common/monthapi";
import Depart from "../../mycomponents/common/Depart";
import MyDatePicker from "../../mycomponents/common/MyDatePicker";
import Utils from "../../../common/utils";
let util = new Utils();
let api = new monthApi();
export default {
  name: "monthsum",
  components: {
    Depart,
    MyDatePicker
  },
  created: function() {
    var date = new Date();
    var year = date.getFullYear();
    var month = date.getMonth() + 1;
    month = month < 10 ? "0" + month : month;
    var mydate = year.toString() + "-" + month.toString();
    this.belongTime = mydate;
    this.thismonth.belongTime = mydate;
    this.loaddata(mydate, true);
    this.loaddata(this.getLastMonth(mydate), false);
  },
  data: function() {
    return {
      thismonthpositions: 0,
      thismonthtotalChanges: 0,
      thismonthincreaseWorkers: 0,
      thismonthtotalEmployees: 0,
      thismonthotherWorkers: 0,
      thismonthtotaledus: 0,
      thismonthdecreaseWorkers: 0,
      thismonthtotalkeeps: 0,
      lastmonthpositions: 0,
      lastmonthtotalChanges: 0,
      lastmonthincreaseWorkers: 0,
      lastmonthtotalEmployees: 0,
      lastmonthotherWorkers: 0,
      lastmonthtotaledus: 0,
      lastmonthdecreaseWorkers: 0,
      lastmonthtotalkeeps: 0,
      departmentId: "",
      departname: "",
      belongTime: "",
      editable: false,
      lastmonth: api.getDefaultVal(),
      thismonth: api.getDefaultVal()
    };
  },
  watch: {
    thismonth: {
      handler(curval, oldval) {
        this.showDiff(curval);
      },
      deep: true
    }
  },
  methods: {
    showDiff(curval) {
      for (var name in curval) {
        if (curval[name] != this.lastmonth[name]) {
          if (
            this.$refs[name] &&
            this.$refs[name].$refs.input &&
            this.$refs[name].$refs.input.style
          ) {
            this.$refs[name].$refs.input.style["border-color"] = "red";
            this.$refs[name].$refs.input.style["color"] = "red";
          }
        } else {
          if (
            this.$refs[name] &&
            this.$refs[name].$refs.input &&
            this.$refs[name].$refs.input.style
          ) {
            this.$refs[name].$refs.input.style["border-color"] = "#e4e7ed";
            this.$refs[name].$refs.input.style["color"] = "#c0c4cc";
          }
        }
      }
    },
    sumtotal(owner, bThis) {
      if (bThis) {
        var data = api.sum(owner.thismonth);
        owner.thismonthpositions = data.positions;
        owner.thismonthtotalChanges = data.totalChanges;
        owner.thismonthincreaseWorkers = data.increaseWorkers;
        owner.thismonthtotalEmployees = data.totalEmployees;
        owner.thismonthotherWorkers = data.otherWorkers;
        owner.thismonthtotaledus = data.totaledus;
        owner.thismonthdecreaseWorkers = data.decreaseWorkers;
        owner.thismonthtotalkeeps = data.totalkeeps;
      } else {
        var data = api.sum(owner.lastmonth);
        owner.lastmonthpositions = data.positions;
        owner.lastmonthtotalChanges = data.totalChanges;
        owner.lastmonthincreaseWorkers = data.increaseWorkers;
        owner.lastmonthtotalEmployees = data.totalEmployees;
        owner.lastmonthotherWorkers = data.otherWorkers;
        owner.lastmonthtotaledus = data.totaledus;
        owner.lastmonthdecreaseWorkers = data.decreaseWorkers;
        owner.lastmonthtotalkeeps = data.totalkeeps;
      }
    },
    getLastMonth(time) {
      console.log("time:" + time);
      var times = time.split("-");
      var year = Number.parseInt(times[0]);
      var month = Number.parseInt(times[1]);
      if (month == 1) {
        year = year - 1;
        month = 12;
      } else {
        month = month - 1;
      }
      if (month < 10) {
        month = "0" + month;
      }
      return year + "-" + month;
    },
    ontimechanged(time) {
      var lastmonth = this.getLastMonth(time);
      this.loaddata(lastmonth, false);
      this.belongTime = time;
      this.loaddata(this.belongTime, true);
    },
    exportData() {
      api.export(this.belongTime, 1,this.$store.state.user.id);
    },
    loaddata(belongTime, beThis) {
      console.log("time:" + belongTime);
      var that = this;
      api.get(belongTime,1, resp => {
        // that.thismonth.departmentId = resp.body.body.department.id;
        // that.departmentId = resp.body.body.department.id;
        // that.departname = resp.body.body.department.name;
        if (resp.body.result == 1) {
          if (beThis) {
            if (!resp.body.body.stats[0]) {
              that.thismonth = api.getDefaultVal();
            } else {
              that.thismonth = api.sumAll(resp.body.body.stats);
            }
            that.sumtotal(that, true);
          } else {
            if (!resp.body.body.stats[0]) {
              that.lastmonth = api.getDefaultVal();
            } else {
              that.lastmonth = api.sumAll(resp.body.body.stats);
            }
            that.sumtotal(that, false);
          }
        }
      });
    }
  }
};
</script>

<style>
.table > thead:first-child > tr:first-child > th {
  border-top: 1px solid #352f2f;
}
.table-bordered > tbody > tr > td,
.table-bordered > tfoot > tr > td {
  border: 1px solid #352f2f;
}
.table-bordered > thead > tr > th,
.table-bordered > tbody > tr > th,
.table-bordered > tfoot > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > tbody > tr > td,
.table-bordered > tfoot > tr > td {
  border: 1px solid #352f2f;
}
.row {
  padding: 10px 10px;
}
.control-label {
  padding-top: 10px;
}
.red {
  border-color: "red";
  color: "red";
}
</style>
